<template>
	<div class="app-container">
		<el-form :inline="true" :model="dataForm" @submit.native.prevent @keyup.enter.native="getDataList()">
		  <el-form-item>
		    <el-input placeholder="内部检验依据" v-model="dataForm.accordingToInside" :clearable="true" size="mini">
		      <template slot="prepend">检验依据</template>
		    </el-input>
		  </el-form-item>

      <el-form-item>
        <el-select v-model="dataForm.isOk" filterable clearable placeholder="全部状态" size="mini">
          <el-option label="待配置" value="1" />
          <el-option label="已配置" value="0" />
      	</el-select>
      </el-form-item>

      <el-form-item>
        <el-button type="info" class="pan-btn info-btn" size="mini" @click="showSpecialItem" icon="el-icon-s-grid">公共项目</el-button>
      </el-form-item>

		  <el-form-item>
		    <el-button v-if="isAuth('base:hour:list')" type="primary" class="pan-btn primary-btn" size="mini" @click="searchData()" icon="el-icon-search">搜索</el-button>
		  </el-form-item>
		</el-form>
		<el-table
			:data="dataList"
			v-loading="dataListLoading"
			border
      fit
      highlight-current-row
		  style="width: 100%">
		<el-table-column
			prop="inspectionItemId"
			header-align="center"
			align="center"
			label="编号"
      width="100">
		</el-table-column>
    <el-table-column
    	header-align="center"
    	align="center"
    	label="状态"
      width="100">
      <template slot-scope="{row}">
        <el-tag :type="row.manHourOne == null || row.manHourTwo == null ? 'danger' : 'success'" size="small">
          {{ row.manHourOne == null || row.manHourTwo == null ? '待配置' : '已配置' }}
        </el-tag>
      </template>
    </el-table-column>
		<el-table-column
			prop="accordingToInside"
			header-align="center"
			align="center"
			label="检验依据">
		</el-table-column>
    <el-table-column
    	prop="inspectionItemName"
    	header-align="center"
    	align="center"
    	label="检验项目">
    </el-table-column>
    <el-table-column
    	prop="manHourOne"
    	header-align="center"
    	align="center"
    	label="工时1"
      width="100">
    </el-table-column>
    <el-table-column
    	prop="manHourTwo"
    	header-align="center"
    	align="center"
    	label="工时2"
      width="100">
    </el-table-column>
		<el-table-column
      fixed="right"
      header-align="center"
      align="center"
      label="操作"
      width="100">
      <template slot-scope="scope">
        <el-button v-if="isAuth('base:hour:update')" type="text" size="small" @click="updateData(scope.row)">修改</el-button>
      </template>
    </el-table-column>
		</el-table>
		<el-pagination
		  @size-change="sizeChangeHandle"
		  @current-change="currentChangeHandle"
		  :current-page="pageIndex"
		  :page-sizes="[10, 20, 50, 100]"
		  :page-size="pageSize"
		  :total="totalPage"
		  layout="total, sizes, prev, pager, next, jumper"
		></el-pagination>

		<update-module
			v-if="updateModuleVisible"
			@close="closeInner('updateModuleVisible')"
			@refreshData="getDataList"
			:childDataForm="childDataForm" />

    <special-module
      v-if="specialItemVisible"
      @close="closeInner('specialItemVisible')" />
	</div>
</template>

<script>
	import { getItemList } from "@/api/item"
	import CommonMethod from '@/views/mixin/common'
	import { CODE_OK } from '@/common/js/config'
	import UpdateModule from './hour-update'
  import SpecialModule from './hour-special'
	export default{
    name: 'jixiao',
		mixins: [CommonMethod],
		data() {
			return {
		    dataForm: {},
		    dataList: [],
		    pageIndex: 1,
		    pageSize: 10,
		    totalPage: 0,
		    dataListLoading: false,
		    selectionList: [],
				updateModuleVisible: false,
				childDataForm: '',
        specialItemVisible: false
		  }
		},
		components: {
			UpdateModule,SpecialModule
		},
		mounted() {
			if (this.isAuth('base:hour:list')){
				this.getDataList()
			}
		},
		methods: {
      showSpecialItem() {
        this.specialItemVisible = true
      },
			searchData() {
				this.pageIndex=1
				this.getDataList()
			},
			getDataList() {
				this.dataListLoading = true
				const params = {
					page: this.pageIndex,
				  limit: this.pageSize,
          accordingToInside: this.dataForm.accordingToInside || null,
          isOk: this.dataForm.isOk || null
				}
				getItemList(params).then(res => {
					if (res.code === CODE_OK) {
						this.dataList = res.page.list
						this.totalPage = res.page.totalCount
					}else{
						this.$message.error(res.msg)
					}
					this.dataListLoading = false
				}).catch()
			},
			updateData(row) {
        this.childDataForm = JSON.parse(JSON.stringify(row))
        this.updateModuleVisible = true
			},
      closeInner(prop) {
        this.childDataForm = ""
        this[prop] = false
      }
		}
	}
</script>

<style scoped>
  >>> .el-form-item__content {
    line-height: normal;
  }
</style>
